<template>
  <div class="activity-container">
    <div class="header">
      <div class="back-btn btn-sword" @click="goBack">返回</div>
      <div class="title brush-title">活动模块索引</div>
      <div class="placeholder"></div>
    </div>

    <div class="panel-container">
      <div class="panel-header">
        <div class="panel-title">活动子模块</div>
        <div class="panel-subtitle">选择一个模块进入</div>
      </div>

      <div class="module-list">
        <div class="module-item" v-for="m in modules" :key="m.id" @click="go(m.path)">
          <div class="name">{{ m.name }}</div>
          <div class="desc">{{ m.desc }}</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      modules: [
        { id: 'login', name: '连续登录', desc: '连续登录奖励与进度', path: '/pages/activity/login' },
        { id: 'achievement', name: '成就系统', desc: '追踪成就并领取奖励', path: '/pages/activity/achievement' },
        { id: 'level', name: '等级成长', desc: '等级成长奖励领取', path: '/pages/activity/level' },
        { id: 'monthly', name: '月度签到', desc: '本月签到与奖励', path: '/pages/activity/monthly' },
        { id: 'newbie', name: '新人七日', desc: '新人七日登陆奖励', path: '/pages/activity/newbie' }
      ]
    }
  },
  methods: {
    goBack() { uni.navigateBack() },
    go(path) { uni.navigateTo({ url: path }) }
  }
}
</script>

<style scoped>
.activity-container { padding-bottom: 30rpx; }
.header { display:flex; justify-content:space-between; align-items:center; padding:30rpx 40rpx; }
.placeholder{ width:80rpx; }
.panel-container { padding: 20rpx; }
.panel-header { display:flex; justify-content:space-between; align-items:center; margin-bottom: 20rpx; }
.panel-title { font-weight: 600; }
.panel-subtitle { color: #666; font-size: 24rpx; }
.module-list { display:flex; flex-direction:column; gap: 16rpx; }
.module-item { padding: 20rpx; border: 1px solid #eee; border-radius: 12rpx; }
.name{ font-weight: 600; }
.desc{ color:#666; margin-top: 6rpx; }
</style>